﻿module Sustainalytics.Screening {

    export interface JQuery {
        slider(value: any): any;
        slider(option: string, property: string, newValue: any): any;
    }

    var mod = angular.module(screeningToolModuleName);

    mod.directive('slidercriteriatype5', (screeningToolFactory) => {

        return {
            restrict: 'E',
            scope: {
                value: '=',
                sliderpips: '=',
                templatenumber: '=',
                answertext: '='
            },
            replace: true,
            template: "<div></div>",
            link: (scope: any, elem, attrs, ctrl) => {

                //var sliderValuesPrivate = [];
                scope.sliderTextMap = [];
                scope.sliderValues = [];
                scope.sliderObj = elem;
                scope.sliderObj.slider({
                    range: "min",
                    min: 0,
                    max: 10,
                    step: 1,
                    value: scope.value,
                    change: (event, ui) => {
                        if (scope.sliderValues == undefined || scope.sliderValues == null || scope.sliderValues.length == 0 ||
                            ui.value >= scope.sliderValues.length || scope.sliderObj.slider("value") == ui.value)
                            return;

                        var correctVal = scope.sliderValues[ui.value];
                        scope.sliderObj.slider("value", ui.value); // triggger change 

                        scope.$evalAsync(function () {
                            scope.value = correctVal;
                            scope.answertext = screeningToolFactory.composeAnswerTextCriteriaTypeFive(scope.sliderTextMap[correctVal]);
                        });
                    },
                    slide: (event, ui) => {
                        if (scope.sliderValues == undefined || scope.sliderValues == null || scope.sliderValues.length == 0 || ui.value >= scope.sliderValues.length)
                            return;

                        var correctVal = scope.sliderValues[ui.value];
                        scope.sliderObj.slider("value", ui.value); // triggger change 

                        scope.$evalAsync(function () {
                            scope.value = correctVal;
                            scope.answertext = screeningToolFactory.composeAnswerTextCriteriaTypeFive(scope.sliderTextMap[correctVal]);
                        });
                    }
                });

                scope.$watch("value", (newValue) => {

                    //|| scope.sliderObj.slider("value") == sliderValuesPrivate.indexOf(newValue)
                    if (newValue == undefined || isNaN(newValue) || scope.sliderpips == null)
                        return;

                    scope.sliderTextMap = [];
                    scope.sliderValues = [];
                    screeningToolFactory.processCriteriaFiveAnswers(scope.sliderpips, scope.sliderTextMap, scope.sliderValues);
                    scope.sliderValues[0] = "Off";
                    scope.sliderObj.slider("option", "max", scope.sliderValues.length - 1);
                    var correctVal = scope.sliderValues.indexOf(newValue);

                    if (scope.sliderObj != null)
                        scope.sliderObj.slider("value", correctVal);
                });

                scope.$watch("sliderpips", (newValue) => {
                    if (newValue == null || scope.value == null)
                        return;

                    scope.sliderTextMap = [];
                    scope.sliderValues = [];
                    screeningToolFactory.processCriteriaFiveAnswers(newValue, scope.sliderTextMap, scope.sliderValues);
                    scope.sliderValues[0] = "Off";
                    scope.sliderObj.slider("option", "max", scope.sliderValues.length - 1);
                    scope.sliderObj.slider("pips", { rest: "label", labels: scope.sliderValues });

                    // set value first time 
                    scope.answertext = screeningToolFactory.composeAnswerTextCriteriaTypeFive(scope.sliderTextMap[scope.value]);
                });

            }
        }
    });
}